<template>
  <div>
    <button type="button" v-on:click="selectFile()" class="btn btn-white btn-default btn-round">
      <i class="ace-icon fa fa-upload"></i>
      {{ text }}
    </button>
    <input class="hidden" type="file" ref="file" v-on:change="uploadFile()" v-bind:id="inputId+'-input'">
    <p></p>
  </div>
</template>

<script>
export default {
  name: 'big-file',
  props: {
    text: {
      default: "上传大文件"
    },
    inputId: {
      default: "file-upload"
    },
    suffixs: {
      default: []
    },
    use: {
      default: ""
    },
    shardSize: {
      default:50 * 1024
    },
    url: {
      default:"oss-append"
    },
    afterUpload: {
      type: Function,
      default: null
    },
  },
  data: function () {
    return {}
  },
  methods: {
    uploadFile() {
      let _this = this;
      let formData = new window.FormData();
 4      //得到这样图片
      let file = _this.$refs.file.files[0];
      console.log(JSON.stringify(file));
      /*
        name: "test.mp4"
        lastModified: 1901173357457
        lastModifiedDate: Tue May 27 2099 14:49:17 GMT+0800 (中国标准时间) {}
        webkitRelativePath: ""
        size: 37415970
        type: "video/mp4"
      */

      // 生成文件标识，标识多次上传的是不是同一个文件
      let key = hex_md5(file.name + file.size + file.type);
      let key10 = parseInt(key, 16);
      let key62 = Tool._10to62(key10);
      console.log(key, key10, key62);
      console.log(hex_md5(Array()));

      /*
        d41d8cd98f00b204e9800998ecf8427e
        2.8194976848941264e+38
        6sfSqfOwzmik4A4icMYuUe
       */


      // 判断文件格式

      //设置支持的类型
      let suffixs = _this.suffixs;
      //得到文件名
      let fileName = file.name;
      //得到文件的后缀名字，并且全部转成小写。
      let suffix = fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length).toLowerCase();
      //定义一个后缀校验变量。
      let validateSuffix = false;
      //循环判断文件后缀是否和已经设置的是否一样。
      for (let i = 0; i < suffixs.length; i++) {
        if (suffixs[i].toLowerCase() === suffix) {
          //如果一样就改成true
          validateSuffix = true;
          break;
        }
      }
      //如果校验未通过就提示校验未通过。
      if (!validateSuffix) {
        Toast.warning("文件格式不正确！只支持上传：" + suffixs.join(","));
        $("#" + _this.inputId + "-input").val("");
        return;
      }

      // 文件分片
      //let shardSize = 50 * 1024;    //以20MB为一个分片
      // let shardSize = 5 * 1024 * 1024;    //以20MB为一个分片
      let shardSize = _this.shardSize;
      let shardIndex = 1;		//分片索引
      //当前分片起始位置
      let start = (shardIndex - 1) * shardSize;
      //当前分片结束位置 起始位置和他的大小相加
      let end = Math.min(file.size, start + shardSize);
      //从文件中截取当前的分片数据
      let fileShard = file.slice(start, end);
      //计算总文件大小
      let size = file.size;
      //总片数
      let shardTotal = Math.ceil(size / shardSize);


      //想别的方法传递参数
      let param = {
        'shardIndex': shardIndex,
        'shardSize': shardSize,
        'shardTotal': shardTotal,
        'use': _this.use,
        'name': file.name,
        'suffix': suffix,
        'size': file.size,
        'key': key62
      };

      _this.upload(param);
    },



    /**
     * 将分片数据转成base64进行上传
     */
    upload: function (param) {
      //得到上一个方法的参数
      let _this = this;
      let shardIndex = param.shardIndex;
      let shardTotal = param.shardTotal;
      let shardSize = param.shardSize;
      let fileShard = _this.getFileShard(shardIndex, shardSize);


      // 将图片转为base64进行传输
      let fileReader = new FileReader();

      Progress.show(parseInt((shardIndex - 1) * 100 / shardTotal));

      fileReader.onload = function (e) {
        let base64 = e.target.result;
        // console.log("base64:", base64);
        param.shard = base64;


        _this.$ajax.post(process.env.VUE_APP_SERVER + '/file/admin/' + _this.url, param).then((response) => {
          let resp = response.data;
          console.log("上传文件成功：", resp);
          Progress.show(parseInt(shardIndex * 100 / shardTotal));
          //循环上传分片
          if (shardIndex < shardTotal) {
            //上传下一个分片
            param.shardIndex = param.shardIndex + 1;
            _this.upload(param);
          } else {
            Progress.hide();
            _this.afterUpload(resp);
            $("#" + _this.inputId + "-input").val("");
          }

        });
      };
      fileReader.readAsDataURL(fileShard);
    },


    /**
     * 检查文件状态，是否已上传过？传到第几个分片？
     */
    check(param) {
      let _this = this;
      _this.$ajax.get(process.env.VUE_APP_SERVER + '/file/admin/check/' + param.key).then((response) => {
        let resp = response.data;
        if (resp.success) {
          let obj = resp.content;
          if (!obj) {
            param.shardIndex = 1;
            console.log("没有找到文件记录，从分片1开始上传");
            _this.upload(param);
          } else if (obj.shardIndex === obj.shardTotal) {
            // 已上传分片 = 分片总数，说明已全部上传完，不需要再上传
            Toast.success("文件极速秒传成功！");
            _this.afterUpload(resp);
            $("#" + _this.inputId + "-input").val("");
          } else {
            param.shardIndex = obj.shardIndex + 1;
            console.log("找到文件记录，从分片" + param.shardIndex + "开始上传");
            _this.upload(param);
          }
        } else {
          Toast.warning("文件上传失败");
          $("#" + _this.inputId + "-input").val("");
        }
      })
    },

    getFileShard (shardIndex, shardSize) {
      let _this = this;
      let file = _this.$refs.file.files[0];
      let start = (shardIndex - 1) * shardSize;	//当前分片起始位置
      let end = Math.min(file.size, start + shardSize); //当前分片结束位置
      let fileShard = file.slice(start, end); //从文件中截取当前的分片数据
      return fileShard;
    },

    selectFile() {
      let _this = this;
      $("#" + _this.inputId + "-input").trigger("click");
    }
  }
}
</script>
